<template>
  <div style="width:100%;">
    <el-dialog :visible.sync="show"  width="800px" top="50px">
        <span slot="title"></span>
        <img :src='bigImage' style='width:800px;margin:-55px -20px -40px'/>
    </el-dialog>
    <div style="float:left;width:30%;height:auto">
        <el-form label-position="right" label-width="100px" size="mini">
            <el-form-item label="商家编码:">
                <span>{{merchant.merchantCode}}</span>
            </el-form-item>
            <el-form-item label="登录账号:">
                <span>{{merchant.loginName}}</span>
            </el-form-item>
            <el-form-item label="商家名称:">
                <span>{{merchant.companyName}}</span>
            </el-form-item>
            <el-form-item label="商家类型:">
                <span v-if="merchant.merchantType=='PERSON'">个体</span>
                <span v-else>企业</span>
            </el-form-item>
            <el-form-item label="商家电话:">
                <span>{{merchant.companyPhone}}</span>
            </el-form-item>
            <el-form-item label="商家地址:">
                <span>{{merchant.address}}</span>
            </el-form-item>
            <el-form-item label="联系人姓名:">
                <span>{{merchant.contactName}}</span>
            </el-form-item>
            <el-form-item label="联系人手机:">
                <span>{{merchant.contactMobile}}</span>
            </el-form-item>
            <el-form-item label="微信:">
                <span>{{merchant.wechat}}</span>
            </el-form-item>
            <el-form-item label="QQ:">
                <span>{{merchant.qq}}</span>
            </el-form-item>
            <el-form-item label="电子邮箱:">
                <span>{{merchant.email}}</span>
            </el-form-item>
        </el-form>
    </div>
    <div style="float:left;width:25%;height:auto">
        <el-form label-position="right" label-width="100px" size="mini">
            <el-form-item label="小程序:">
                <span v-if="merchant.miniAppsEntrance" style='color:teal'>已开通</span>
                <span v-else>未开通</span>
            </el-form-item>
            <el-form-item label="H5:">
                <span v-if="merchant.h5Entrance" style='color:teal'>已开通</span>
                <span v-else>未开通</span>
            </el-form-item>
            <el-form-item label="选择车型模式:">
               <span v-if="merchant.qixiubaoStyle">汽修宝式</span>
               <span v-else-if="merchant.cascader">三级联动</span>
               <span v-else>未选择</span>
            </el-form-item>
            <el-form-item label="基础商城:">
                <span v-if="merchant.basicMall" style='color:teal'>已开通</span>
                <span v-else>未开通</span>
            </el-form-item>
            <el-form-item label="高级商城:">
               <span v-if="merchant.seniorMall" style='color:teal'>已开通</span>
                <span v-else>未开通</span>
            </el-form-item>
            <el-form-item label="会员审核:">
               <span v-if="merchant.memberAudit" style='color:teal'>已开通</span>
                <span v-else>未开通</span>
            </el-form-item>
            <el-form-item label="禁止游客访问:">
               <span v-if="merchant.mustLogin" style='color:teal'>已开通</span>
                <span v-else>未开通</span>
            </el-form-item>
            <el-form-item label="VIN查询:">
               <span v-if="merchant.vinSearch" style='color:teal'>已开通</span>
                <span v-else>未开通</span>
            </el-form-item>
            <el-form-item label="日查询量:">
                <span>{{merchant.vinNum}}</span>
            </el-form-item>
            <el-form-item label="开户时间:">
                <span>{{merchant.createTime}}</span>
            </el-form-item>
            <el-form-item label="服务到期时间:">
                <span>{{merchant.endTime}}</span>
            </el-form-item>
        </el-form>
    </div>
    <div style="float:left;width:30%;height:auto">
        <el-form label-position="right" label-width="100px" size='mini'>
            <el-form-item label="合同号:">
                <span>{{merchant.contract}}</span>
            </el-form-item>
            <el-form-item label="备注:">
                <span>{{merchant.remark}}</span>
            </el-form-item>
            <el-form-item label="商家材料副本:">
                <div style='width:270px;height:400px;margin-top:5px;overflow-y:auto' v-show="merchant.businessLicence!=''">
                    <img v-for="src in merchant.businessLicence.split(',')" @click="showBigImage(src)" :src='src' style='width:100px;height:100px;margin:10px'/>
                </div>
            </el-form-item>
        </el-form>
    </div>
  </div>
</template>

<script>
export default {
  name: 'merchantView',
  data(){
    return {
      show:false,
      bigImage:''
    }
  },
  methods:{
      showBigImage:function(src){
          this.bigImage=src;
          this.show=true;
      }
  },
  props:['merchant']
}
</script>

<style scoped>
</style>
